import React from "react";
import {
  Empty,
  // Button 
} from 'antd';
import AlignMent from './AlignMent';
// import Align from './Align'

// 空状态
function EmptyCom (props) {
  const clickChange = (removeActiveKey) => {
    props.tabPlanDelete(removeActiveKey)
  }
  return <Empty
    image="https://gw.alipayobjects.com/zos/antfincdn/ZHrcdLPrvN/empty.svg"
    imageStyle={{ height: 60 }}
    description={<span style={{ color: '#888', fontSzie: '20px' }}>No Data...</span>}>
    <button
      onClick={clickChange.bind(this, props.removeActiveKey)}
      type="submit" className="bp3-button bp3-intent-primary">
      <span className="bp3-button-text">Create Now</span>
    </button>
  </Empty>
}

// 高阶组件控制组件的显示
function AlignMentConnectComponent (props) {
  return (
    <div style={{ width: '100%', height: '100%' }}>
      {
        !props.success ?
          <EmptyCom setActiveKey={props.setActiveKey} removeActiveKey={props.tabKey} tabPlanDelete={props.tabPlanDelete} />
          :
          <AlignMent {...props} />
      }
    </div>
  )
}

export default AlignMentConnectComponent